<template>
    <div>
        <div class="week-top">
            <span>You May Also Like</span>
        </div>
        <div class="week-content">
            <van-list
            v-model:loading="loading"
            :finished="finished"
            finished-text="没有更多了"
            @load="onLoad"
>

  <Card  v-for="  ( item , index )  in novelslist.length"    :key="item.id"   />
  <!-- <Card  v-for="  ( item , index )  in novelslist"  :novelitem="item"   :key="item.id"   /> -->

</van-list>
                

        </div>


    </div>
</template>

<script>
import Novelmodul from '../com/novelmodul.vue';
import NovelX from '../com/novelX.vue';
import {week} from '@/api/home'
import Card from '@/components/Dreame/cell.vue'
// import weekly from '@com/com/no'
    export default {
    components: { Novelmodul, NovelX },
    data() {
        return {
            loading:false,
            finished:false,
            novelslist:[],
            option: {   page:1 ,  size : 5 }
        }
    },
    
    methods:{
        onLoad(){
           
            this.option.page++  
            this.addlist() 
            // this.loading = false 
          
       
        },
        async  addlist(){
            let result    =await week(this.option)
            if(result.data.list.length <this.option.size){
                this.finished =true
            }
            //  把以前的结果也叠加到一起去 
            console.log(result);
            this.novelslist =  [   ...this.novelslist ,...result.data.list]
        
            console.log( this.novelslist );
            this.loading = false
        }
    },

}
</script>

<style lang="scss" scoped>
.week-top{
    line-height: 1rem;
    margin: 0 auto;
        & span:nth-child(1){
                font-size: 0.6rem;
                color: #1f2129;
                font-weight: 500;
        }
        & span:nth-child(2){
                font-size: 0.3rem;
                color: #4b73f6;
            
                float: right;
        }
}

</style>